import React, { useEffect, useState } from 'react';
import {Descriptions,Avatar,Switch} from 'antd'
import {useLocation} from 'react-router-dom'
import '../../styles/zheng/TeamDetail.scss'
import {getMngtable} from '../../api/zheng/index'
import pic from '../../assets/zheng/ewm.png'
interface Props{

}

function TeamDetail(props:Props) {
    var location = useLocation()
    const [list,setList] = useState([])
    // 挂载期
    useEffect(()=>{
        getMngtable().then((res:any)=>{
            var arr = res.data.filter((item:any)=>{
                return item.id == location.state
            })
            setList(arr)
        })
    },[])
    return (
        <div className='teamdetail'>
            <div className="title">
                <div className='leftborder'></div>
                <h3>我管理的团队详情</h3>
            </div>
            <div className="detail">
                {
                    list.map((item:any) => {
                        return (
                            <>
                                <Descriptions title="医生信息" column={4}>
                                    <Descriptions.Item label="团队编号" >{item.id}</Descriptions.Item>
                                    <Descriptions.Item label="团队名称">{item.teamname}</Descriptions.Item>
                                    <Descriptions.Item label="团队头像"><Avatar src={item.avatar} /> </Descriptions.Item>
                                    <Descriptions.Item label="团队标签">{item.tags}</Descriptions.Item>
                                    <Descriptions.Item label="机构地址">{item.address}</Descriptions.Item>
                                    <Descriptions.Item label="团队评分">{item.score}</Descriptions.Item>
                                    <Descriptions.Item label="签约人数">{item.signnum}</Descriptions.Item>
                                </Descriptions>
                                <Descriptions column={1}>
                                    <Descriptions.Item label="邀请加入二维码"><img src={pic} width={300}/> </Descriptions.Item>
                                    <Descriptions.Item label="创建时间">{item.createtime}</Descriptions.Item>
                                    <Descriptions.Item label="创建人">{item.leader}</Descriptions.Item>   
                                    <Descriptions.Item label="团队状态"><Switch defaultChecked={item.states} checkedChildren="启用" unCheckedChildren="禁用" /> </Descriptions.Item>
                                </Descriptions>
                            </>
                        )
                    })
                    }
                     

            </div>
        </div>
    );
}

export default TeamDetail;